<template>
	<view style="min-height: 100vh;position: relative;background-color: #f2f2f2;">
		<u-navbar title='待办·全部门店'  left-icon-color="white" :titleStyle="{'color':'white'}" bgColor="#13989a" :autoBack="true"  
			:placeholder="true"></u-navbar>
		<!-- <view class="shopName" >
		
		</view> -->
		<view class="container">
			<u-subsection activeColor="#13989a" :list="list" :current="current"  @change="sectionChange"></u-subsection>
			<view v-if="todoVoList.length">
				<view class="floor" v-for="(v,i) in todoVoList" :key="i" style="font-size: 24rpx;color: #a1a1a1;margin-top: 20rpx;" @click="handler(i)">
					<view class="title flex" style="justify-content: space-between;color: black;margin: 10rpx 0;">
						<text v-if="v.assignName">{{v.assignName}}</text> 
						<view style="width: 100rpx;">
							<u-tag text="无整改"  size="mini" v-if="v.isCorrection==0"></u-tag>
							<u-tag text="待整改"  size="mini"   type="warning" v-if="v.isCorrection==1"></u-tag>
							<u-tag text="待审核"  size="mini" type="success" v-if="v.isCorrection==2"></u-tag>
							<u-tag text="已完成"  size="mini"  v-if="v.isCorrection==3"></u-tag>
						</view>
					</view>
					<view style="margin: 10rpx 0;color: #5f5f5f;">
						{{v.templateName}}
					</view>
					<view style="margin: 10rpx 0;color: #5f5f5f;">
						{{v.createTime}}
					</view>
					<view class="flex" style="margin: 10rpx 0;">
						<view class="tag">
							<text>{{typeFn(v.patrolType)}} </text>
						</view>
						<view class="tag">
							提交人：{{v.patrolUserName}}
						</view>
					</view>
					<!-- <view
					class="flex"
						style="justify-content: space-between;align-items: center;font-size: 28rpx;color: #5f5f5f;padding: 30rpx;background-color:#f7f7f7;border-radius: 10rpx;">
						 <view class="flex" style="justify-content: space-between;align-items: center;">
						 	<image src="https://renovationcdn.jiachuangnet.com/index/indexBg.png" mode="" style="width: 120rpx;height: 100rpx;"></image>
						 	<text style="margin-left: 10rpx;">有人推迟开门</text>
						 </view>
						
					</view> -->
					
				</view>
			</view>
			<view v-else>
				<view style="width: 100%;height: 50vh;" >
					<u-empty
					        icon="https://renovationcdn.jiachuangnet.com/empty.jpg"
							width="100%"
							height="100%"
							text="数据为空"
					>
					</u-empty>
				</view>
			</view>
			
		</view>
		<u-popup :show="shopNameShow" @close="shopNameShow=false" round="10" mode="bottom">
			<view class="overdueForm" style="padding-top: 20rpx;height: 80vh;overflow-y: auto;">
				<view style="text-align: center;font-size: 30rpx;margin-bottom: 50rpx;">
					选择门店
				</view>
				<view class="workerSearch" style="">
					<image style="width: 34rpx;height: 34rpx;"
						src="https://renovationcdn.jiachuangnet.com/index/workerIndex/search.png"></image>
					<u-input placeholder="请输入门店名称搜索" style="height: 78rpx;" v-model="keyword"></u-input>
				</view>
				<u-subsection activeColor="#13989A" :list="list1" :current="current1"
					@change="sectionChange1"></u-subsection>
				<view class="floor"   style="border-bottom: 1rpx solid #d4d4d4;">
					<view class="title" >
						测试门店
					</view>
				</view>
			</view>
		</u-popup>
		<u-popup :show="todoListShow" @close="todoListShow=false" round="10" mode="bottom">
			<view class="overdueForm" style="padding: 20rpx;height: 80vh;overflow-y: auto;" v-if="todoVoList[activeIndex]">
				<view style="text-align: center;font-size: 30rpx;margin-bottom: 50rpx;">
					{{todoVoList[activeIndex].assignName}}
				</view>
				<view class="floor"   style="background-color: #f2f2f2;">
					<view style="margin: 10rpx 0;">
						{{todoVoList[activeIndex].templateName}}
					</view>
					<view class="flex" style="margin: 10rpx 0;">
						<view class="tag" style="background-color: #ffffff;">
							提交人：{{todoVoList[activeIndex].patrolUserName}}
						</view>
						<view class="tag" style="background-color: #ffffff;">
							{{todoVoList[activeIndex].createTime}}
						</view>
					</view>
				</view>
				<view class="floor" v-for="(v,i) in rectificationApprovalVoList" @click="toPath(v,i)" :key="i" style="background-color: #f2f2f2;border-radius: 10rpx;">
					<view class="title">
						{{v.problemName}}
					</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
			data() {
				return {
					keyword:'',
	                list: ['全部', '待整改','待审核','已完成'],
					list1: ['按店铺', '按区域'],
					current: 0,
					current1: 0,
					todoVoList:[],
					templateName:'',
					shopNameShow:false,
					todoListShow:false,
					activeIndex:0,
					rectificationApprovalVoList:[]
				}
			},
			onShow() {
				this.getTodoVo()
				if(this.todoListShow){
					this.handler(this.activeIndex)
				}
			},
			methods:{
				handler(activeIndex){
					this.activeIndex=activeIndex
					uni.$u.http.post('/patrol/getRectificationApprovalVo',{
						patrolRecordId:this.todoVoList[activeIndex].patrolRecordId,
						isCorrection:this.todoVoList[activeIndex].isCorrection
					}).then(res=>{
						if(res){
							this.rectificationApprovalVoList=res
							if(this.rectificationApprovalVoList.length<=0){
								this.todoListShow=false
								uni.$u.toast('当前项无待办 :)');
							}else{
								this.todoListShow=true
							}
						}
					})
					
					
				},
				// 1 在线巡查 2 线下巡查 3 在线点检 4 线下点检
				typeFn(index){
					const arr=[
						'在线巡查',
						'线下巡查',
						'在线点检',
						'线下点检'
					]
					return arr[index-1]
				},
				getTodoVo(){
					uni.$u.http.post('/patrol/getTodoVo',{
						pageNumber:1,
						pageSize:1000,
						flag:this.current,//0 全部 1 待整改 2 待审核 3 已完成
					}).then(res=>{
						this.todoVoList=res.data
					})
				},
				
				sectionChange(e){
					this.current=e
					this.getTodoVo()
				},
				sectionChange1(e){
					this.current1=e
				},
				toPath(msg,i){
					let last=0
					if((this.rectificationApprovalVoList.length-1)==i){
						last=1
					}
					let app = getApp();
					app.recordDetailsIdList=JSON.parse(JSON.stringify(this.rectificationApprovalVoList))
					msg.templateName=this.todoVoList[this.activeIndex].templateName
					const obj=JSON.stringify(msg)
					let isCorrection=this.todoVoList[this.activeIndex].isCorrection
					uni.navigateTo({
						url: `/packageC/pages/todo/todo?obj=${obj}&patrolRecordId=${this.todoVoList[this.activeIndex].patrolRecordId}&isCorrection=${isCorrection}&last=${last}`
					})
				}
			}
		}
</script>

<style lang="scss" scoped>
	.tag{
		margin-left: 10rpx;
		padding: 5rpx 10rpx;
		border-radius: 10rpx;
		background-color: #f9f9f9;
		font-size: 28rpx;
	}
	.shopName{
		padding-top: 150rpx;
		text-align: center;
		font-weight: 700;
		font-size: 30rpx;
		z-index: 1000;
		line-height: 100rpx;
	}
	.container {
		width: 92vw;
		padding: 30rpx;
		z-index: 10;
		position: absolute;
		top: 180rpx;
		overflow: hidden;
		border-radius: 20rpx;
	}
	.workerSearch {
		border-radius: 40rpx;
		display: flex;
		align-items: center;
		padding-left: 22rpx;
		width: 100%rpx;
		height: 60rpx;
		background-color: #e6e6e6;
		opacity: 0.9;
		margin: 10rpx 0;
	}
	.floor{
		background-color: #fff;
		border-radius: 10rpx;
		padding: 20rpx;
		margin-bottom: 20rpx;
		.title{
			font-weight: 600;
			font-size: 30rpx;
		}
	}
	.floor1{
		background-color: #fff;
		border-radius: 10rpx;
		margin-bottom: 20rpx;
		overflow: hidden;
		.title{
			font-weight: 600;
			font-size: 30rpx;
		}
	}
</style>